<template>
	<view class="cmdq-user">
		<image class="cmdq-user-bg" src="../../static/userBg.png"></image>
		<view class="cmdq-user-info">
			<view class="info-avtar_name">
				<view class="info-avtar">
					<image src="../../static/header.png"></image>
				</view>
				<view class="info-name">
					<text>{{userInfo.nickName ? userInfo.nickName : '微信用户'}}</text>
					<text v-if="userInfo.phone || userInfo.mobile">{{userType === 'wechat' ? userInfo.mobile : userInfo.phone}}</text>
				</view>
			</view>
			<view class="info-icon" v-if="!isLogin" @click="goLogin">
				<u-icon name="arrow-right"></u-icon>
			</view>
		</view>

		<!-- <view class="cmdq-user-grid">
			<u-grid :col="4" :border="false" @click="to" >
				<u-grid-item
					v-for="(item,index) in gridList" 
					v-if="isShowMenu(item)"
					:key="item.title">
						<u-icon 
							:customStyle="{paddingTop:20+'rpx'}"
							:name="item.icon"
							:size="22"></u-icon>
						<text class="grid-text">{{item.title}}</text>
				</u-grid-item>
			</u-grid>
		</view> -->
		<view class="cmdq-user-grid-two">
			<u-grid :col="4" :border="false" @click="to1" >
				<u-grid-item
					v-for="(item,index) in gridList2" 
					:key="index">
						<u-icon 
							:customStyle="{paddingTop:20+'rpx'}"
							:name="item.icon"
							:size="22"></u-icon>
						<text class="grid-text">{{item.title}}</text>
				</u-grid-item>
			</u-grid>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				isLogin: true,
				showPhone: false,
				phones: ['13570513190', '18890262450'],
				gridList: [
					// {
					// 	icon: 'kefu-ermai',
					// 	title: '运单查询',
					// 	path: '/pages/order/list',
					// 	show: 1
					// },
					// {
					// 	icon: 'map',
					// 	title: '地址管理',
					// 	path: '/cmhqPage/addressBook/addressBook',
					// 	show: 1
					// },
					// {
					// 	icon: 'order',
					// 	title: '未结清订单',
					// 	path: '/cmhqPage/unAccountList/unAccountList',
					// 	show: 2
					// },
				],
				gridList2: [
					{
						icon: 'kefu-ermai',
						title: '帮助中心',
						path: '/cmhqPage/helpCenter/helpCenter'
					},
					{
						icon: 'order',
						title: '合同',
						path: '/pages/user/contract'
					},
					{
						icon: 'order',
						title: '退出登录',
						path: '/cmhqPage/login/login'
					}
				],
				Statistics: [],
				userInfo: {},
				userType: ''
			}
		},
		computed: {

		},
		onLoad() {
			this.isLogin = uni.getStorageSync('token2')?.token ? true : false
			this.userType = uni.getStorageSync('userType')
			this.userInfo = uni.getStorageSync('user2')? uni.getStorageSync('user2').user : {}
		},
		onShow() {
			this.isLogin = uni.getStorageSync('token2')?.token ? true : false;
		},
		methods: {
			isShowMenu(item){
				if(item.show === 2){
					return this.userType === 'wechat'
				}else{
					return true
				}
			},
			goLogin() {
				if (!this.isLogin) {
					uni.navigateTo({
						url: '/cmhqPage/login/login'
					})
				}
			},
			loginClose() {
				this.isLogin = this.$us.checkLogin();
				this.getUserInfo();
				this.getStatistics();
			},
			to(name){
				if (!this.isLogin) {
					uni.navigateTo({
						url: '/cmhqPage/login/login'
					})
					return
				}
				if(this.gridList[name].title === '运单查询'){
					uni.switchTab({
						url: this.gridList[name].path
					})
				}else{
					uni.navigateTo({
						url: this.gridList[name].path
					})
				}
			},
			to1(name) {
				const url = this.gridList2[name].path
				const title = this.gridList2[name].title
				let _this = this
				if(title === '退出登录'){
					uni.showModal({
						title: '提示',
						content: '确定退出登录？',
						success: function (res) {
							if (res.confirm) {
								uni.removeStorageSync('user2')
								uni.removeStorageSync('token2')
								uni.removeStorageSync("userJob")
								uni.navigateTo({
									url: url
								})
							} else if (res.cancel) {
								_this.$uti.alert('取消退出')
							}
						}
					});

				}else{
					if (!this.isLogin) {
						uni.navigateTo({
							url: '/cmhqPage/login/login'
						})
						return
					}
					uni.navigateTo({
						url: url
					})
				}
			},
			openPhone(phone) {
				uni.makePhoneCall({
					phoneNumber: phone, //电话号码
					success: function(e) {
						console.log(e);
					},
					fail: function(e) {
						console.log(e);

					}
				})
			},
			getStatistics() {
				var that = this;
				that.$http.post('User/UserDataStatistics', {
					userGuid: that.$us.getId()
				}, function(res) {
					if (res.StatusCode == 1) {
						that.Statistics = res.Data;
						console.log('数据统计', that.Statistics)
					}
				})
			},
			getUserInfo() {
				var that = this;
				// that.$http.post('User/UserInfo', {
				// 	userGuid: that.$us.getId()
				// }, function(res) {
				// 	if (res.StatusCode == 1) {
				// 		that.userInfo = res.Data;
				// 	} else {
				// 		that.$uti.alert(res.Message);
				// 		uni.clearStorageSync();
				// 		that.isLogin = false;
				// 	}
				// })
			}
		},
		onShareAppMessage(res) {
			let that = this;
			var title = '这里寄快递超便宜,5块钱起寄全国,赶紧收藏起来';
			let imageUrl = '/static/share.jpg';
			if (res.from === 'button') {
				//这块需要传参，不然链接地址进去获取不到数据
				return {
					title: title,
					path: '/pages/index/index?uid=' + that.$us.getId(),
					imageUrl: imageUrl
				};
			}
			if (res.from === 'menu') {
				return {
					title: title,
					path: '/pages/index/index?uid=' + that.$us.getId(),
					imageUrl: imageUrl
				};
			}
		},
		// 分享到朋友圈
		onShareTimeline() {
			let imageUrl = '/static/share.jpg';
			return {
				title: title,
				path: '/pages/index/index?uid=' + that.$us.getId(),
				imageUrl: imageUrl
			};
		}
	}
</script>

<style lang="scss" scoped>
.cmdq-user{
	width: 100%;
	font-family: PingFang SC,Microsoft Yahei,Helvetica Neue,Helvetica,Tahoma,sans-serif;
	.cmdq-user-bg{
		position: absolute;
		width: 100%;
		height: 300rpx;
		top: -24rpx;
	}
	.cmdq-user-info{
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 24rpx;
		height: 128rpx;
		margin-top: 24rpx;
		cursor: pointer;
		.info-avtar_name{
			display: flex;
			align-items: center;
			.info-avtar{
				width: 80rpx;
				height: 80rpx;
				border-radius: 50%;
				overflow: hidden;
				margin-right: 16rpx;
				image{
					width: 100%;
					height: 100%;
				}
			}
			.info-name{
				font-size: 42rpx;
				font-weight: bold;
				color: #333;
				display: flex;
				flex-direction: column;
				text:last-child{
					font-size: 28rpx;
					color: #333;
					margin-top: 8rpx;
				}
			}
		}
	}
	.cmdq-user-grid{
		padding: 24rpx;
		background-color: #fff;
		margin: 180rpx 24rpx 0;
		border-radius: 16rpx;
		font-size: 24rpx;
		.grid-text{
			margin-top: 8rpx;
			color: #666;
		}
	}
	.cmdq-user-grid-two{
		padding: 24rpx;
		background-color: #fff;
		margin: 48rpx 24rpx 0;
		border-radius: 16rpx;
		font-size: 24rpx;
		.grid-text{
			margin-top: 8rpx;
			color: #666;
		}
	}
}
</style>
